import React, { useState, useRef } from 'react'
import { View, Text, ScrollView, StyleSheet } from 'react-native';
import { Button, Picker } from '../../components';
import BaseView from '../components/base-view'
import { multiColumnData, cascadeData } from "./data"
export default (props: any) => {
  const confirm = (data:any)=>{
    console.log(data)
  }
  const change = (data:any)=>{
    console.log(data)
  }
  return (
    <View style={{ backgroundColor: '#f2f2f2', flex: 1, width: '100%', height: '100%' }}>
      <BaseView title="基础用法">
        <Button style={styles.mrb} type="primary" >基础用法</Button>
      </BaseView>
      <BaseView title="嵌入内容">
        <Button style={styles.mrb} type="primary">嵌入内容</Button>
      </BaseView>
      {/* <Picker onChange={change} columns={multiColumnData} onConfirm={confirm}></Picker> */}
      <Picker onChange={change} onConfirm={confirm}  columns={cascadeData} cascadeLevel={3} customFieldName={{value:"text"}}></Picker>
    </View>
  )
}

const styles = StyleSheet.create({
  mr: {
    marginRight: 20,
  },
  mrb: {
    marginRight: 20,
  },
})